import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import htmlConfig from 'vite-plugin-html-config'
import { viteExternalsPlugin } from 'vite-plugin-externals'
import { viteStaticCopy } from 'vite-plugin-static-copy'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'

// https://vitejs.dev/config/
export default defineConfig(({ command, mode }) => {
  console.log(command, mode)

  const plugins = [vue()]
  // 拷贝静态资源文件到指定目录
  const copy = viteStaticCopy({
    targets: [
      {
        src: 'node_modules/cesium/Build/CesiumUnminified/*',
        dest: 'lib/cesium'
      },
      {
        src: 'src/config/*',
        dest: 'config'
      }
    ]
  })
  // 导出全局变量，挂载在window对象下
  const externalConfig = viteExternalsPlugin({
    cesium: 'Cesium'
  })
  // 动态往index.html页面中插入标签
  const htmlConfigs = htmlConfig({
    headScripts: [
      {
        src: './lib/cesium/Cesium.js'
      },
      {
        src: './config/sysconfig.js'
      }
    ],
    links: [
      {
        // ******* Always use external CesiumJS's style util official package output. *******
        // ******* 直到官方 CesiumJS 包导出样式文件前，都使用外部样式 *******
        rel: 'stylesheet',
        href: './lib/cesium/Widgets/widgets.css'
      }
    ]
  })

  // 自动导入插件
  const autoImport = AutoImport({
    resolvers: [ElementPlusResolver()]
  })
  const component = Components({
    resolvers: [ElementPlusResolver()]
  })

  plugins.push(autoImport, component, copy, externalConfig, htmlConfigs)

  return {
    // 如果项目是在域名下的某个子目录中，那么base项的值就是：对应子目录的目录名！！
    //  例如：项目代码是放在域名下的 h5 目录中，那么 base: '/h5/',
    // 参照：https://juejin.cn/post/7051928499849789476
    // base配置说明：https://cn.vitejs.dev/config/shared-options.html#base

    // 路由回退：https://router.vuejs.org/zh/guide/essentials/history-mode.html
    // nginx：“try_files $uri $uri/ /cesium-app/index.html”;  "cesium-app"为你部署的项目的文件夹名称
    base: '/cesium-app/',

    plugins: plugins,
    resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url))
      }
    },
    build: {
      // rollupOptions: {
      //   output: {
      //     // 拆包配置，把第三方类库独立打包成js文件
      //     manualChunks: {
      //       jquery: ['jquery']
      //     }
      //   }
      // }
    }
  }
})
